aboutsummaryrefslogtreecommitdiff
path: root/pages/anime/[...id].js
diff options
context:
space:
mode:
authorFactiven <[email protected]>2023-05-02 14:24:20 +0700
committerGitHub <[email protected]>2023-05-02 14:24:20 +0700
commit467dedc0fb192c360e02d0e67555dc5317e62311 (patch)
treefc0a449015a71bbeeef890755be309f48fc99064 /pages/anime/[...id].js
parentUpdate issue templates (diff)
parentMerge branch 'main' into pre-production (diff)
downloadmoopa-467dedc0fb192c360e02d0e67555dc5317e62311.tar.xz
moopa-467dedc0fb192c360e02d0e67555dc5317e62311.zip
Update v3.5.4
> Small UI adjustment
Diffstat (limited to 'pages/anime/[...id].js')
-rw-r--r--pages/anime/[...id].js22
1 files changed, 13 insertions, 9 deletions
diff --git a/pages/anime/[...id].js b/pages/anime/[...id].js
index 26c42cb..4b759b6 100644
--- a/pages/anime/[...id].js
+++ b/pages/anime/[...id].js
@@ -447,21 +447,25 @@ export default function Info() {
</div>
)}
</div>
- <div className="bg-secondary rounded-sm h-[30px]">
- <div className="flex items-center justify-center h-full gap-10 p-2">
+ <div className="bg-secondary rounded-sm xs:h-[30px]">
+ <div className="grid grid-cols-3 place-content-center xs:flex items-center justify-center h-full xs:gap-10 p-2 text-sm">
{info && info.status !== "NOT_YET_RELEASED" ? (
<>
- <div className="flex-center gap-2">
+ <div className="flex-center flex-col xs:flex-row gap-2">
<TvIcon className="w-5 h-5 text-action" />
<h4 className="font-karla">{info?.type}</h4>
</div>
- <div className="flex-center gap-2">
+ <div className="flex-center flex-col xs:flex-row gap-2">
<ArrowTrendingUpIcon className="w-5 h-5 text-action" />
<h4>{info?.averageScore}%</h4>
</div>
- <div className="flex-center gap-2">
+ <div className="flex-center flex-col xs:flex-row gap-2">
<RectangleStackIcon className="w-5 h-5 text-action" />
- <h1>{info?.episodes} Episodes</h1>
+ {info?.episodes ? (
+ <h1>{info?.episodes} Episodes</h1>
+ ) : (
+ <h1>TBA</h1>
+ )}
</div>
</>
) : (
@@ -676,8 +680,8 @@ export default function Info() {
)}
{info?.nextAiringEpisode && (
<div className="flex items-center gap-2">
- <div className="flex items-center gap-4">
- <h1>Next Ep :</h1>
+ <div className="flex items-center gap-4 text-[10px] xxs:text-sm md:text-base">
+ <h1>Next :</h1>
<div
className="px-5 rounded-sm font-karla font-bold bg-white text-black"
// style={color}
@@ -741,7 +745,7 @@ export default function Info() {
<div className="flex flex-col">
<h1>{epiStatus} while retrieving data</h1>
<pre
- className={`rounded-md overflow-hidden ${getLanguageClassName(
+ className={`rounded-md ${getLanguageClassName(
"bash"
)}`}
>